<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script>
	</head>

	<body>
		<div id="app">
			<!-- 绑定的是一个无参 函数,直接写函数名,小括号可以省略 -->
			<button v-on:click="fun1">点我啊</button>
			<!-- 简写方式 -->
			<button @click="fun1">点我啊2</button>
			<button @click="fun2">点击3</button>
			<hr />
			<!-- 点击事件 传参数时,可以直接使用vue 属性数据 -->
			<button @click="fun3(message)">有参 点击</button>
			<input type="text" v-model="message" @change="check" @mouseover="hello" />
		</div>
		<script>
			new Vue({
				el: "#app",
				data: {
					message:"哦呵呵"
				},
				methods:{
					fun1:function(){
						console.log("点击了fun1")
					},
					fun2(){
						console.log("函数的简写方式")
					},
					fun3(word){
						console.log("参数值:"+word)
					},
					check(){
						console.log("检查啦")
					},
					hello(){
						console.log("hello")
					}
				}
			})
		</script>
	</body>

</html>